;var preview = {
    defaultImage: 'images/default.jpg',
    containerClass: 'ln-preview-container',
    imageClass: 'ln-content-image',
    $container: {},
    init() {
        let containerClass = this.containerClass;
        let imageClass = this.imageClass;
        let $body = $('body');
        if ($body.hasClass(`.${containerClass}`))
            return;

        let modal = `<div class="ln-modal"></div>`;
        let content = `<div class="ln-content"><img class="${imageClass}" /></div>`;
        let $container = $(`<div class="${containerClass}">${modal}${content}</div>`);

        this.$container = $container;
        $body.append($container);

        this.bindEvent();
        this.hide();
    },
    bindEvent() {
        let containerClass = `.${this.containerClass}`,
            imageClass = `.${this.imageClass}`;
        let $body = $('body'),
            $container = this.$container;

        //滚动放大缩小
        $body.on('mousewheel', containerClass, e => {
            this.scroll(e, $container);
        });//

        //空白区域点击隐藏
        $container.on('click', () => {
            this.hide();
        });

        //禁止图片点击冒泡
        $container.on('click', imageClass, e => {
            e.stopPropagation();
        });

        //加载错误的图片显示默认
        let defaultImage = this.defaultImage;
        if (defaultImage) {
            $container.find(imageClass).on('error', function (e) {
                let origin = $(this).attr('src');
                //避免默认图片出错, 死循环
                if (origin !== defaultImage)
                    $(this).attr('src', defaultImage).attr('alt', defaultImage);
            });
        }
    },
    scroll(e, $container) {
        let imageClass = `.${this.imageClass}`;
        let event = e.originalEvent;
        let deltaY = event.deltaY;

        let width = $container.find(imageClass).width();
        width += deltaY;

        width = width < 100 ? 100 : width;
        $container.find(imageClass).width(width);
    },

    show(url) {
        let $container = $(`.${this.containerClass}`),
            imageClass = `.${this.imageClass}`,
            $body = $('body');

        $container.find(imageClass).attr('src', url).attr('alt', url);

        $body.css('overflow', 'hidden')
        $container.show();
    },
    hide() {
        let $container = $(`.${this.containerClass}`),
            $body = $('body');

        $body.css('overflow', '')
        $container.hide();
    },
};